<div class="lg:w-80 flex-shrink-0">
    <div class="bg-white rounded-lg border p-4">
        <div class="text-center">
            <% if (book.cover_image) { %>
                <div class="flex items-center justify-center">
                    <img src="<%= book.cover_image %>"
                         alt="<%= book.title %>"
                         class="border min-w-36 max-w-36 min-h-48 max-h-48 sm:w-16 sm:h-full object-cover rounded-lg">
                </div>
            <% } else { %>
                <div class="flex items-center justify-center mx-auto border min-w-36 max-w-36 min-h-48 max-h-48 bg-gray-100 rounded-lg">
                    <div class="text-center">
                        <i class="fas fa-book text-gray-400 text-4xl mb-3"></i>
                        <p class="text-gray-500 text-sm">暂无封面</p>
                    </div>
                </div>
            <% } %>
        </div>

        <div class="bg-gray-200 h-px my-4"></div>

        <nav class="space-y-2 my-4">
            <%- include('../../components/nav', { href: `/book/${book.username}/${book.slug}`, text: '书籍概要', icon: 'fas fa-book', className: 'w-full py-3' }) %>
            <%- include('../../components/nav', { href: `/book/${book.username}/${book.slug}/chapters`, text: '章节目录', icon: 'fas fa-list', className: 'w-full py-3' }) %>
        </nav>

        <div class="border-t py-3 border-gray-200">
            <div class="space-y-3">
                <div class="flex justify-between text-sm">
                    <span class="text-gray-500">发布时间</span>
                    <span class="text-gray-900"><%= book.created_at %></span>
                </div>
                <div class="flex justify-between text-sm">
                    <span class="text-gray-500">更新时间</span>
                    <span class="text-gray-900"><%= book.updated_at %></span>
                </div>
            </div>
        </div>
    </div>
</div>